<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
  <head>
    <meta charset="utf-8">
	<title>救援界面</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
	<link href="css/bootstrap.css" rel="stylesheet">
	<link href="css/site.css" rel="stylesheet">
    <link href="css/bootstrap-responsive.css" rel="stylesheet">

    <!--[if lt IE 9]>
      <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>

    <![endif]-->
	<!--[if lte IE 8]><script src="js/excanvas.min.js"></script><![endif]-->
    <style type="text/css">
    html, body {
        height: 100%;
    }
    </style>
  </head>
  <script src="js/jquery.js"></script>
  <script src="js/jquery.flot.js"></script>
  <script src="js/jquery.flot.resize.js"></script>
  <script src="js/bootstrap.min.js"></script>
  <script type="text/javascript" src="https://api.map.baidu.com/api?v=1.0&amp;type=webgl&amp;ak=K3ydaZ42YBTWDQGQ8UTCAitdIMBygzbf"></script>
  <body>
  <div class="navbar navbar-fixed-top">
      <div class="navbar-inner">
          <div class="container-fluid">
              <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
                  <span class="icon-bar"></span>
                  <span class="icon-bar"></span>
                  <span class="icon-bar"></span>
              </a>
              <a class="brand" href="#">Admin</a>
              <div class="btn-group pull-right">
                  <a class="btn" href="my-profile"><i class="icon-user"></i> Admin</a>
                  <a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
                      <span class="caret"></span>
                  </a>
                  <ul class="dropdown-menu">
                      <li><a href="my-profile">个人资料</a></li>
                      <li class="divider"></li>
                      <li><a href="#">退出</a></li>
                  </ul>
              </div>
              <div class="nav-collapse">
                  <ul class="nav">
                      <li><a href="index">首页</a></li>
                      <li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown">用户 <b class="caret"></b></a>
                          <ul class="dropdown-menu">
                              <li><a href="new-user">新建用户</a></li>
                              <li class="divider"></li>
                              <li><a href="users">管理用户</a></li>
                          </ul>
                      </li>
                      <li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown">角色 <b class="caret"></b></a>
                          <ul class="dropdown-menu">
                              <li><a href="new-role">新建角色</a></li>
                              <li class="divider"></li>
                              <li><a href="roles">管理角色</a></li>
                          </ul>
                      </li>
                      <li><a href="stats">救援</a></li>
                  </ul>
              </div>
          </div>
      </div>
  </div>

    <div class="container-fluid">
      <div class="row-fluid">
          <div class="span2">
              <div class="well sidebar-nav">
                  <ul class="nav nav-list">
                      <li class="nav-header"><i class="icon-map-marker"></i> 地图</li>
                      <li><a href="index">uwb界面</a></li>
                      <li class="active"><a href="stats">救援界面</a></li>
                      <li class="nav-header"><i class="icon-user"></i> 管理</li>
                      <li><a href="users">用户</a></li>
                      <li><a href="roles">角色</a></li>
                      <li class="nav-header"><i class="icon-wrench"></i> 设置</li>
                      <li><a href="my-profile">我的资料</a></li>
                      <li><a href="setting">串口设置</a></li>
                      <li><a href="#">退出</a></li>
                  </ul>
              </div>
              <div>
                  <div style="height: 100px">
                      <div class="span6">
                          <div style="width: 100%;margin-top: 20px">
                              <button id="systemstatu" th:align="center" style="border-radius: 30px; height: 60px;width: 100%"  class="btn btn-success" type="button">无人员落水</button>
                          </div>
                      </div>
                      <div class="span6" style="" >
                          <button style="margin-top: 10px;width: 120px" class="btn btn-success" onclick="fanhang()" id="fanhang">返航</button>
                          <button style="margin-top: 10px;width: 120px" class="btn btn-success" onclick="setSafe()" id="fuwei">复位</button>
                          <!--手动修正1,靠近落水人员时修正-->
                          <div style="width: 100%;margin-top: 20px" >
                              <div data-backdrop="false" class="modal fade" id="handalert" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
                                  <div class="modal-dialog" role="document">
                                      <div class="modal-content">
                                          <div class="modal-header">
                                              <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
                                              <h2 class="modal-title" id="myModalLabel">操作提示</h2>
                                          </div>
                                          <div  style="height: 30px;margin: 0px" class="alert alert-info" role="alert">
                                              <h1>请开启遥控器</h1>
                                          </div>
                                          <div class="modal-footer">
                                              <button onclick="stopOption()" type="button" class="btn btn-default" data-dismiss="modal"><span class="glyphicon glyphicon-remove" ></span>上一步</button>
                                              <button onclick="shoudong_submit()" type="button" id="shoudong_submit" class="btn btn-primary" data-dismiss="modal"><span class="glyphicon glyphicon-floppy-disk" aria-hidden="true"></span>遥控器已开启</button>
                                          </div>
                                      </div>
                                  </div>
                              </div>
                          </div>
                          <!--手动修正2,按钮切换手动控制-->
                          <div style="width: 100%;margin-top: 20px" >
                              <div data-backdrop="false" class="modal fade" id="handalert2" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
                                  <div class="modal-dialog" role="document">
                                      <div class="modal-content">
                                          <div class="modal-header">
                                              <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
                                              <h2 class="modal-title" id="myModalLabel2">操作提示</h2>
                                          </div>
                                          <div  style="height: 30px;margin: 0px" class="alert alert-info" role="alert">
                                              <h1>请开启遥控器</h1>
                                          </div>
                                          <div class="modal-footer">
                                              <button onclick="unstop()" type="button" class="btn btn-default" data-dismiss="modal"><span class="glyphicon glyphicon-remove" ></span>关闭</button>
                                              <button onclick="shoudong_submit2()" type="button" id="shoudong_submit2" class="btn btn-primary" data-dismiss="modal"><span class="glyphicon glyphicon-floppy-disk" aria-hidden="true"></span>遥控器已开启</button>
                                          </div>
                                      </div>
                                  </div>
                              </div>
                          </div>
                          <!--手动控制中-->
                          <div style="width: 100%;margin-top: 20px" >
                              <div data-backdrop="false" class="modal fade" id="handing" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
                                  <div class="modal-dialog" role="document">
                                      <div class="modal-content">
                                          <div class="modal-header">
                                              <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
                                              <h2 class="modal-title" >提示</h2>
                                          </div>
                                          <div  style="height: 30px;margin: 0px" class="alert alert-info" role="alert">
                                              <h1>当前正在手动控制中</h1>
                                          </div>
                                          <div class="modal-footer">
                                              <button onclick="$('#closeyaokon').modal();stoPing();" type="button"  class="btn btn-primary" data-dismiss="modal"><span class="glyphicon glyphicon-floppy-disk" aria-hidden="true"></span>已接到落水人员</button>
                                          </div>
                                      </div>
                                  </div>
                              </div>
                          </div>
                          <!--手动控制中2-->
                          <div style="width: 100%;margin-top: 20px" >
                              <div data-backdrop="false" class="modal fade" id="handing2" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
                                  <div class="modal-dialog" role="document">
                                      <div class="modal-content">
                                          <div class="modal-header">
                                              <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
                                              <h2 class="modal-title" >提示</h2>
                                          </div>
                                          <div  style="height: 30px;margin: 0px" class="alert alert-info" role="alert">
                                              <h1>当前正在手动控制中</h1>
                                          </div>
                                          <div class="modal-footer">
                                              <button onclick="$('#closeyaokon2').modal();stoPing();" type="button"  class="btn btn-primary" data-dismiss="modal"><span class="glyphicon glyphicon-floppy-disk" aria-hidden="true"></span>关闭遥控器</button>
                                          </div>
                                      </div>
                                  </div>
                              </div>
                          </div>
                          <!--关闭遥控器提示-->
                          <div style="width: 100%;margin-top: 20px" >
                              <div data-backdrop="false" class="modal fade" id="closeyaokon" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
                                  <div class="modal-dialog" role="document">
                                      <div class="modal-content">
                                          <div class="modal-header">
                                              <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
                                              <h2 class="modal-title" >提示</h2>
                                          </div>
                                          <div  style="height: 30px;margin: 0px" class="alert alert-info" role="alert">
                                              <h1>请关闭遥控器</h1>
                                          </div>
                                          <div class="modal-footer">
                                              <button onclick="$('#handing').modal();unstop();" type="button" class="btn btn-default" data-dismiss="modal"><span class="glyphicon glyphicon-remove" ></span>上一步</button>
                                              <button onclick="closetofanghang();unstop();" type="button"  class="btn btn-primary" data-dismiss="modal"><span class="glyphicon glyphicon-floppy-disk" aria-hidden="true"></span>已关闭,直接返航</button>
                                          </div>
                                      </div>
                                  </div>
                              </div>
                          </div>
<!--                          关闭遥控器提示2-->
                          <div style="width: 100%;margin-top: 20px" >
                              <div data-backdrop="false" class="modal fade" id="closeyaokon2" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
                                  <div class="modal-dialog" role="document">
                                      <div class="modal-content">
                                          <div class="modal-header">
                                              <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
                                              <h2 class="modal-title" >提示</h2>
                                          </div>
                                          <div  style="height: 30px;margin: 0px" class="alert alert-info" role="alert">
                                              <h1>请关闭遥控器</h1>
                                          </div>
                                          <div class="modal-footer">
                                              <button onclick="$('#handing2').modal();unstop();" type="button" class="btn btn-default" data-dismiss="modal"><span class="glyphicon glyphicon-remove" ></span>上一步</button>
                                              <button onclick="closetosystem();unstop();" type="button"  class="btn btn-primary" data-dismiss="modal"><span class="glyphicon glyphicon-floppy-disk" aria-hidden="true"></span>已关闭,系统接管</button>
                                          </div>
                                      </div>
                                  </div>
                              </div>
                          </div>
                          <div style="width: 100%;margin-top: 20px" >
                              <div data-backdrop="false" class="modal fade" id="stopoption" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
                                  <div class="modal-dialog" role="document">
                                      <div class="modal-content">
                                          <div class="modal-header">
                                              <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
                                              <h2 class="modal-title">停止提示</h2>
                                          </div>
                                          <div style="height: 60px;margin: 0px" class="alert alert-info" role="alert">
                                              <h1>救生圈已靠近落水人员,请进行下一步操作</h1>
                                          </div>
                                          <div class="modal-footer">
                                              <button onclick="fanhang()" type="button" class="btn btn-success" data-dismiss="modal"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span>已接到落水人员</button>
                                              <button onclick="test()" type="button" id="" class="btn btn-primary" data-dismiss="modal"><span class="glyphicon glyphicon-floppy-disk" aria-hidden="true"></span>手动修正</button>
                                          </div>
                                      </div>
                                  </div>
                              </div>
                              <div data-backdrop="false" class="modal fade" id="Lost" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
                                  <div class="modal-dialog" role="document">
                                      <div class="modal-content">
                                          <div class="modal-header">
                                              <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
                                              <h2 class="modal-title">失联提示</h2>
                                          </div>
                                          <div style="height: 30px;margin: 0px" class="alert alert-info" role="alert">
                                              <h1>救生圈失联,请等待自动返航完成</h1>
                                          </div>
                                          <div class="modal-footer">
                                              <button type="button" class="btn btn-success" data-dismiss="modal"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span>确定</button>
                                          </div>
                                      </div>
                                  </div>
                              </div>
                          </div>
                      </div>
                  </div>
                  <div>
                      <!--救生圈信息-->
                      <div  style="width: 100%;margin-top: 20px">
                          <div style="width:100%;">
                              <div align="center"  class="alert alert-success" role="alert">
                                  <h2>救生圈</h2>
                                  <div style="width: 90%" align="left">
                                      <span>Id：</span><span id="buoyId"></span><br>
                                      <span>状态：</span><span style="font-size:20px;color: red" id="buoyS"></span><br>
                                      <span>经度：</span><span id="buoyX"></span><br>
                                      <span>纬度：</span><span id="buoyY"></span><br>
                                      <span>电压：</span><span id="buoyV"></span><br>
                                      <span>距落水者：</span><span id="buoyD"></span><br>
                                  </div>
                              </div>
                          </div>
                      </div>
                      <!--标签信息-->
                      <div style="width: 100%;margin-top: 20px">
                          <div style="width: 100%;">
                              <div align="center"  class="alert alert-info" role="alert">
                                  <h2>头盔</h2>
                                  <div style="width: 90%" align="left">
                                      <span>Id：</span><span id="tagId"></span><br>
                                      <span>经度：</span><span id="tagX"></span><br>
                                      <span>纬度：</span><span id="tagY"></span><br>
                                      <span>漂流速度：</span><span id="tagS"></span><br>
                                      <span>到基站距离：</span><span id="tagL"></span><br>
                                  </div>
                              </div>
                          </div>
                      </div>
                      <!--紧急停止-->
                      <div style="width: 100%;height: 50px">

                          <div class="span6" style="height: 100%;">
                              <button style="width: 100%;height: 100%" class="btn btn-danger" onclick="stopstop()" id="stopstop">紧急停止</button>
                          </div>
                          <div class="span6" style="height: 100%;">

                              <button style="width: 100%;height: 100%;" class="btn btn-success" onclick="test2()" id="shoudong">开启手动控制</button>
                          </div>
                      </div>
                  </div>
              </div>
          </div>
          <div class="span10">
		  <div class="row-fluid">
			<div class="page-header">
				<h1>救援界面<small>Some statistics...</small></h1>
			</div>
			<div id="container" style=" width: 100%; height:700px"></div>
		  </div>
        </div>
      </div>

      <hr>

      <footer class="well">
        © Admin
      </footer>
    </div>
  <!--警告有人员落水-->
  <div data-backdrop="false" class="modal fade" id="putbuoy" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
      <div class="modal-dialog" role="document">
          <div class="modal-content">
              <div align="center" class="modal-header">
                  <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
                  <h2 class="modal-title" style="color:crimson">警报!疑似有人员落水</h2>
              </div>
              <div  style="margin: 0px;"  class="alert alert-danger" role="alert">
                  <h2>请进行操作</h2>

              </div>
              <div class="modal-footer">
                  <button onclick="setSafe()" type="button" class="btn btn-success" data-dismiss="modal"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span>无人员落水,设为安全</button>
                  <button  onclick="jiuyuanmodel()" type="button"  class="btn btn-primary" data-dismiss="modal"><span class="glyphicon glyphicon-floppy-disk" aria-hidden="true"></span>设为救援</button>
              </div>
          </div>
      </div>
  </div>
  <!--放下救生圈-->
  <div data-backdrop="false" class="modal fade" id="putjiushengquan" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
      <div class="modal-dialog" role="document">
          <div class="modal-content">
              <div align="center" class="modal-header">
                  <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
                  <h2 class="modal-title" style="color:black">请放下救生圈!</h2>
              </div>
              <div  style="margin: 0px;height: 200px"  class="alert alert-heading" role="alert">
                  <h2>救生圈操作说明:</h2>
                  <h5>1.拿起救生圈..</h5>
                  <h5>2.放入..</h5>
              </div>
              <div class="modal-footer">
                  <button onclick="putinwater()" type="button"  class="btn btn-primary" data-dismiss="modal"><span class="glyphicon glyphicon-floppy-disk" aria-hidden="true"></span>救生圈已完成上电校准</button>
              </div>
          </div>
      </div>
  </div>
  <!--安全点-->
  <div data-backdrop="false" class="modal fade" id="safemodal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
      <div class="modal-dialog" role="document">
          <div class="modal-content">
              <div align="center" class="modal-header">
                  <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
                  <h2 class="modal-title" style="color:#dc143c">救援已完成，请将救生圈断电</h2>
              </div>
              <div class="modal-footer">
                  <button type="button" class="btn btn-default" data-dismiss="modal"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span>关闭</button>
                  <button onclick="setSafe()" type="button"  class="btn btn-success" data-dismiss="modal"><span class="glyphicon glyphicon-floppy-disk" aria-hidden="true"></span>救生圈已断电</button>
              </div>
          </div>
      </div>
  </div>
  <!--紧急停止-->
  <div data-backdrop="false" class="modal fade" id="STOP" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
      <div class="modal-dialog" role="document">
          <div class="modal-content">
              <div align="center" class="modal-header">
                  <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
                  <h2 class="modal-title" style="color:#dc143c">紧急停止中</h2>
              </div>
              <div class="modal-footer">
                  <button onclick="unstop()" type="button" class="btn btn-default" data-dismiss="modal"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span>关闭</button>
              </div>
          </div>
      </div>
  </div>
    <script type="text/javascript">
        var fuwei=false;
        var fanghan=false;
        var kai=false;
        window.onload=function () {
            disable()
        }
        function disable(){
            $('#stopstop').attr('disabled',true);
            $('#shoudong').attr('disabled',true);
            $('#fanhang').attr('disabled',true);
            $('#fuwei').attr('disabled',true);
            $("#stopstop").css("background","#626262");
            $("#shoudong").css("background","#626262");
            $("#fanhang").css("background","#626262");
            $("#fuwei").css("background","#626262");
        }
        function enable(){
            $('#stopstop').attr('disabled',false);
            $('#shoudong').attr('disabled',false);
            $('#fanhang').attr('disabled',false);
            $('#fuwei').attr('disabled',false);
            $("#stopstop").css("background","#ED2D2D");
            $("#shoudong").css("background","#57AF57");
            $("#fanhang").css("background","#57AF57");
            $("#fuwei").css("background","#57AF57");
        }
        /*返航*/
        function fanhang(){
            fanghan=true;

            unstop()
            $.ajax({
                url:"/setting/fanhang",
                success:function (data) {
                }
            })
        }
        /*开启救援模式*/
        function jiuyuanmodel() {
            $('#putjiushengquan').modal();
            $.ajax({
                url:"/setting/jiuyuan",
                success:function (data) {

                }
            })
        }
        /*救生圈落水*/
        function putinwater() {
            enable()
            $.ajax({
                url:"/setting/putinwater",
                success:function (data) {

                }
            })
        }
        /*复位*/
        function setSafe(){
            $.ajax({
                url:"/index/setQiangSafe",
                data:{"id":-1},
                success:function (){
                    location.reload();
                    fuwei=true;
                }
            })
        }
        /*停止中*/
        function stoPing(){
            $.ajax({
                url:"/setting/stoPing",
            })
        }
        /*停止停止*/
        function unstop(){
            $.ajax({
                url:"/setting/unstop"
            })
        }
        /*开启手动模式*/
        function shoudong_submit(){
            $('#handing').modal();
            $.ajax({
                url:"/setting/shoudongsubmit",
                success:function (data) {
                    $("#shoudong").text("关闭手动控制")
                    unstop()
                }
            })
        }
        /*开启手动模式2*/
        function shoudong_submit2(){
            $('#handing2').modal();
            $.ajax({
                url:"/setting/shoudongsubmit",
                success:function (data) {
                    $("#shoudong").text("关闭手动控制")
                    unstop()
                }
            })
        }
        /*停止等待操作*/
        function stopOption() {
            stoPing()
            $('#stopoption').modal();
        }
        /*紧急停止*/
        function stopstop(){
            stoPing();
            $('#STOP').modal();
        }
        /*关闭遥控器返航*/
        function closetofanghang() {
            test();
            fanhang();
        }
        /*仅仅关闭遥控器*/
        function closetosystem() {
            test();
        }
        /*点击手动按钮*/
        function test() {
            stoPing()
            $.ajax({
                url:"/setting/getshoudong",
                success:function (data) {
                    if(!data) {
                        $('#handalert').modal();
                    }
                    else {
                        $("#shoudong").text("开启手动控制")
                        unstop()
                    }
                }
            })
        }
        /*点击手动按钮2*/
        function test2() {
            stoPing()
            $.ajax({
                url:"/setting/getshoudong",
                success:function (data) {
                    if(!data) {
                        $('#handalert2').modal();
                    }
                    else {
                        $("#shoudong").text("开启手动控制")
                        unstop()
                    }
                }
            })
        }
        var point=new BMapGL.Point(114.404729,30.52621);
        // 创建点坐标
        var map = new BMapGL.Map("container");
        // 创建地图实例
        map.centerAndZoom(point, 20);
        map.disableNormalization
          // 初始化地图，设置中心点坐标和地图级别
          map.enableScrollWheelZoom(true);
          var marker=new BMapGL.Marker(point);
          map.addOverlay(marker);
          //标签响应事件
          marker.addEventListener("click",function () {
              alert('当前经纬度:114.404926, 30.529189')
          })
          //地图响应事件
          map.addEventListener('click', function (e) {
              alert('点击位置经纬度：' + e.latlng.lng + ',' + e.latlng.lat);
          });
          var Tag=point;
          var Buoy=point;
          var websocket=null;
          if('WebSocket' in window){
              websocket=new WebSocket('ws://localhost:8081/afterwebSocket');
          }
          else {
              alert('该浏览器不支持websocket');
          }
          websocket.onopen=function (event){
              console.log('建立连接');
          }
          websocket.onClose=function (event) {
              console.log('连接关闭')
          }
          websocket.onmessage=function (event){
              console.log('收到消息:'+event.data)
              var tem=JSON.parse(event.data);
              if(tem.tag=="safe"){
                  disable()
                  $("#systemstatu").text("无人员落水")
                  $("#systemstatu").removeClass("btn-warning")
                  $("#systemstatu").removeClass("btn-danger")
                  $("#systemstatu").addClass("btn-success")
              }
              else if(tem.tag=="alert")
              {
                  disable()
                  $("#systemstatu").text("警报,有人员落水!!")
                  $("#systemstatu").removeClass("btn-success")
                  $("#systemstatu").removeClass("btn-danger")
                  $("#systemstatu").addClass("btn-warning")
                  map.clearOverlays();
                  $("#tagId").text(tem.Tag.tagId)
                  $("#tagX").text(tem.Tag.tagX.toFixed(5))
                  $("#tagY").text(tem.Tag.tagY.toFixed(5))
                  $("#tagS").text(tem.Tag.tagS)
                  $("#tagL").text(tem.Tag.tagL)
                  Tag  = new BMapGL.Point(tem.Tag.tagX, tem.Tag.tagY);
                  map.setCenter(new BMapGL.Point(Tag.lng,Tag.lat));
                  map.addOverlay(new BMapGL.Marker(Tag));
                  $('#putbuoy').modal();
              }
              else if(tem.tag=="help"){
                  $("#systemstatu").text("救援中")
                  $("#systemstatu").removeClass("btn-success")
                  $("#systemstatu").removeClass("btn-warning")
                  $("#systemstatu").addClass("btn-danger")
                  $("#buoyId").text(tem.Buoy.buoyId)
                  $("#buoyS").text(tem.Buoy.buoyS)
                  $("#buoyX").text(tem.Buoy.buoyX.toFixed(5))
                  $("#buoyY").text(tem.Buoy.buoyY.toFixed(5))
                  $("#buoyV").text(tem.Buoy.buoyV)

                  $("#tagId").text(tem.Tag.tagId)
                  $("#tagX").text(tem.Tag.tagX.toFixed(5))
                  $("#tagY").text(tem.Tag.tagY.toFixed(5))
                  $("#tagS").text(tem.Tag.tagS)
                  $("#tagL").text(tem.Tag.tagL)
                  if(tem.shoudong===true)
                  {
                      $("#shoudong").text("关闭手动控制")
                  }
                  else{
                      $("#shoudong").text("开启手动控制")
                  }
                  map.clearOverlays();
                  /*救生圈到标签的距离*/
                  Tag  = new BMapGL.Point(tem.Tag.tagX, tem.Tag.tagY);
                  Buoy = new BMapGL.Point(tem.Buoy.buoyX, tem.Buoy.buoyY);
                  var safepoint = new BMapGL.Point(114.28285, 30.44935);
                  var distance = map.getDistance(Tag,Buoy);
                  var safedistance = map.getDistance(safepoint,Buoy);
                  $("#buoyD").text(distance);
                  /*靠近落水人员*/
                  if(tem.Buoy.MOTOR==="IDLE"&&distance<10)
                  {
                      if(tem.Buoy.buoyS==="救援中"&&!tem.Buoy.Stop&&!fanghan) {
                          stopOption();
                          kai = true;
                      }
                  }
                  else {
                      if(kai===true) {
                          $('#stopoption').modal('hide');
                           unstop()
                           kai=false;
                      }
                  }
                  /*到达安全点*/
                  if(tem.Buoy.MOTOR==="IDLE"&&safedistance<7&&!fuwei)
                  {
                      if(tem.Buoy.buoyS==="返航中") {
                          stoPing()
                          $("#safemodal").modal();
                      }
                  }
                  else {
                      $("#safemodal").modal('hide');
                  }
                  /*后台接收到失联信息*/
                  if(tem.Buoy.Lost)
                  {
                      $("#Lost").modal();
                  }
                  else {
                      $("#Lost").modal('hide');
                  }
                  var polyline = new BMapGL.Polyline([
                      Tag,
                      Buoy,
                  ], {
                      strokeColor: 'blue',
                      strokeWeight: 2,
                      strokeOpacity: 0.5
                  });
                  map.setCenter(new BMapGL.Point((Tag.lng+Buoy.lng)/2, (Tag.lat+Buoy.lat)/2));
                  map.addOverlay(polyline);
                  map.addOverlay(new BMapGL.Marker(Tag));
                  map.addOverlay(new BMapGL.Marker(Buoy));
              }
          }
          websocket.onerror=function (){
              alert('通信发生错误')
          }
          window.onbeforeunload=function (){
              websocket.close();
      }
  </script>
  </body>
</html>
